<template>
	<div>
		<Card class="content-card">
			<Tabs :animated="false">
				<ButtonGroup slot="extra">

					<Button type="primary" size="small" icon="md-refresh" @click="refreshData"></Button>
				</ButtonGroup>
				<TabPane label="配件询价单列表" name="repair">
					<div class="form_group">
						<div class="inputbox">
							<span>询价单号</span>
							<Input style="width:180px;" v-model="params.orderNum"></Input>
						</div>
						<div class="inputbox">
							<span>类型</span>
							<Select style="width:180px;" v-model="params.carTypeId">
								<Option value="">全部</Option>
								<Option v-for="(item,index) in carTypeList" :key="index" :value="item.typeId" >
									{{item.typeName}}
								</Option>
							</Select>
						</div>
						<div class="inputbox">
							<span>品牌</span>
							<Select style="width:180px;" v-model="params.carBrandId">
								<Option value="">全部</Option>
								<Option v-for="(item,index) in carBrandList" :key="index" :value="item.brandId">
									{{item.brandName}}
								</Option>
							</Select>
						</div>
						<div class="inputbox">
							<span>状态</span>
							<Select style="width:180px;" v-model="params.state">
								<Option value="">全部</Option>
								<Option v-for="(item,index) in stateList" :key="index" :value="index">
									{{item}}
								</Option>
							</Select>
						</div>
						<div class="inputbox">
							<Button type="primary" @click="refreshData">查询</Button>
						</div>
					</div>
					<table-view ref="tableView" :tableCol='tableCol' :params="params" :requestUrl='requestUrl'></table-view>
				</TabPane>
			</Tabs>
		</Card>
	</div>
</template>

<script>
    import tableView from '../../components/table'
    import {
        formatDate
    } from '../utils/time.js'
    export default {
        components: {
            tableView
        },
        data() {
            return {
                requestUrl: '/partsInquiry/list',
                stateList: {
                    0: "发布中",
                    1: "报价中",
                    2: "已付款",
                    3: "发货中",
                    4: "已收货",
                    5: "订单完成",
                    6: "申请退货",
                    7: "退货中",
                    8: "退款中",
                    9: "退货完成"
                },
                tableCol: [{
                    title: '序号',
                    type: 'index',
                    width: 70
                },
                    {
                        title: '类型',
                        key: 'typeName'
                    }, {
                        title: '询价单号',
                        key: 'orderNum',
                        minWidth: 120
                    }, {
                        title: '品牌',
                        key: 'brandName'
                    }, {
                        title: '称呼',
                        key: 'buyerName'
                    }, {
                        title: '联系人',
                        key: 'tel'
                    }, {
                        title: '状态',
                        key: 'state',
                        render: (h, params) => {
                            return h("div", this.stateList[params.row.state]);
                        }
                    }, {
                        title: '发布日期',
                        render: (h, params) => {
                            return h('div', formatDate(new Date(params.row.createTime), 'yyyy-MM-dd'))
                        }
                    }, {
                        title: '操作',
                        key: 'action',
                        render: (h, params) => {
                            return h('div', [
                                h('Button', {
                                    props: {
                                        type: 'primary',
                                        size: 'small'
                                    },
                                    on: {
                                        click: () => {

                                            this.$router.push({
                                                path:'/partsInquiryDetail',
                                                query: {
                                                    id: params.row.id
                                                }
                                            });
                                        }
                                    }
                                }, '详情')
                            ])
                        }
                    }],
                params: {
                    pageNo: 1,
                    pageSize: 10,
                    factoryId: sessionStorage.getItem("factoryId"),
                    orderNum: '',
                    carTypeId: '',
                    carBrandId: '',
                    state: ''
                },
                carTypeList: [],
                carBrandList: []
            }
        },
        mounted() {
            // 查询车辆类型列表
            this.queryCarTypeList();
            //查询品牌列表
            this.queryCarBrandList();
        },
        methods: {
            refreshData() {
                this.$refs['tableView'].getData()
            },
            queryCarTypeList() {
                this.$http.post('/cartype/list', {
                    pageNo: '1',
                    pageSize: '100000'
                }).then(res => {
                    if (res.status == 200) {
                        if (res.data.code == 200) {
                            this.carTypeList = res.data.data.rows;
                        }

                    }
                });
            },
            queryCarBrandList() {
                this.$http.post('/brand/list').then(res => {
                    if (res.status == 200) {
                        if (res.data.code == 200) {
                            this.carBrandList = res.data.data;
                        }

                    }
                });
            }
        }
    }
</script>
<style scoped>
	.content-card{
		width: 100%;
	}
	.form_group {
		margin-bottom: 15px;
	}
	.inputbox {
		display: inline-block;
		margin-right: 15px;
	}
	.inputbox span {
		margin-right: 5px;
	}
</style>
<style>
	.ivu-tabs {
		overflow: inherit;
	}
</style>